$(function () {
  // css+html页面加载完毕才触发$function
  getUserInfo()

  // 1 发送请求 获取当前用户信息 渲染到页面中
  function getUserInfo() {
    // 获取当前登录用户的信息
    // 一定要token放在请求头中
    $.ajax({
      url: 'http://localhost:8080/api/v1/admin/user/info',
      // 请求头,
      headers: {
        Authorization: localStorage.getItem('token'),
      },
      success(res) {
        const user = res.data
        // 设置到页面 （3个）
        $('.user_info span').text(user.nickname)
        $('.user_info img').prop('src', user.userPic)
        $('.user_center_link img').prop('src', user.userPic)
      },
    })
  }
  // 2 给退出 绑定点击事件
  $('.logout').on('click', function () {
    // 2.1 弹窗问一下用户 是否要退出  确认框
    // 2.2 确定要退出
    // 2.2.1 删除本地存储的token
    // 2.2.2 跳回到登录页面
    if (confirm('是否要退出')) {
      console.log('要退出')

      localStorage.removeItem('token')
      location.href = 'login.html'
    } else {
      console.log('不退出')
    }
  })
  // 3 给菜单绑定一级标题的点击事件
  $('.level01').on('click', function () {
    // 3.1 控制 被点击标题对应 二级菜单 切换显示 toggle 选择器
    // 找到 this 被点击的元素的下一个兄弟元素-必须类名 level02
    $(this).next('.level02').stop().slideToggle()
    // 3.2 控制 对应 箭头方向切换 -  类切换来实现
    $(this).find('.iconfont').toggleClass('rotate0')
  })
  // 4 给二级标题绑定点击事件
  $('.level02 li').on('click', function () {
    $(this).addClass('active').siblings().removeClass('active')
  })
})
